<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- meta 标签来控制页面缓存 页面不缓存内容 -->
    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
    <meta http-equiv="Pragma" content="no-cache" />
    <meta http-equiv="Expires" content="0" />
    <title>A乎 _ 有问题，就会有答案</title>
    <link rel="icon" href="images/favicon.ico">
    <link rel="stylesheet" href="style.css">
</head>

<body>
    <!-- 返回顶部 -->
    <div class="page-toTop iconfont">
        &#xe633;
    </div>
    <!-- navImg点击显示 -->
    <div class="page2-nav-my">
        <div class="page2-my-san"></div>
        <div class="page2-my-box page5-my">
            <a href="javascript:;">
                <div class="page2-my-ico iconfont">&#xe623;</div>
                <div class="page2-my-wri">我的主页</div>
            </a>
        </div>
        <div class="page2-my-box">
            <label for="signOut">
                <a href="javascript:;" class="signOutBox">
                    <input type="button" id="signOut" title="退出登录"></input>
                    <div class="page2-my-ico iconfont">&#xe819;</div>
                    <div class="page2-my-wri">退出</div>
                </a>
            </label>
        </div>

        <div class="page2-my-box">
            <a href="javascript:;">
                <div class="page2-my-ico iconfont">&#xe636;</div>
                <div class="page2-my-wri">未完待续</div>
            </a>
        </div>
    </div>
    <!-- page1-登录 -->
    <div class="page1-sign">
        <div class="page1-logo-box">
            <div class="logo0">
                <img class="logo" src="images/logo.png" alt="罢工噜~">
            </div>
        </div>
        <div class="page1-form-box">
            <div class="form-box-left">
                <div class="form-left-tit1 tit">打开A乎App</div>
                <div class="form-left-wri1 wri">在[我的页]左上角打开扫一扫</div>
                <div class="QR-code">
                    <img src="images/QR-code.png" alt="罢工噜">
                </div>
                <div class="form-left-wri2 wri">其他扫码方式：微信</div>
                <div class="form-left-but">
                    <div class="form-left-but1 form-but wri">下载A乎App</div>
                    <div class="form-left-but2 form-but wri">开通机构号</div>
                    <div class="form-lrft-but3 form-but wri">无障碍模式</div>
                </div>
            </div>
            <div class="form-box-right">
                <div class="form-right-tit">
                    <div class="form-right-tit1 tit right-tit1">注册</div>
                    <div class="form-right-tit2 tit">密码登录</div>
                </div>
                <div class="form-right-sign1 sign right-sign-dis1">
                    <form>
                        <div class="form-sign-box1">
                            <div class="form-box1-left">中国 +86</div>
                            <div class="form-box1-cen">&nbsp;</div>
                            <div class="form-box1-rig">
                                <input type="number" name="phone" id="phone1" placeholder="手机号" autocomplete="on">
                            </div>
                        </div>

                        <!-- <div class="form-sign-box2">
                            <input type="number" name="text-pas" placeholder="输入6位短信验证码">
                            <button type="button">获取短信验证码</button>
                        </div>
                        <div class="form-sign-box3 wri">
                            获取语音验证码
                        </div> -->
                        <div class="form-sign-box2">
                            <input type="text" name="userName" id="username1" placeholder="请输入用户名">
                        </div>
                        <div class="form-sign-box2">
                            <input type="password" name="password" id="password1" placeholder="请输入密码">
                        </div>
                        <div class="form-box4-but">
                            <button type="button" id="sign0P1">注册</button>
                        </div>
                    </form>
                </div>
                <div class="form-right-sign2 sign right-sign-dis2">
                    <form action="#" method="post">
                        <div class="form-sign-box1 form-pas-wid">
                            <input type="text" name="userName" id="username2" placeholder="请输入用户名">
                        </div>
                        <div class="form-sign-box2 form-pas-wid">
                            <input type="password" name="password" id="password2" placeholder="请输入密码">
                        </div>
                        <div class="signTip">
                        </div>
                        <div class="form-sign-box3">
                            <span class="pas-rem">
                                <label for="remember">
                                    <input type="checkbox" name="pas-rem0" id="remember">记住密码
                                </label>
                            </span>
                            <span class="pas-rem-seven">
                                <label class="seven">
                                    <input type="checkbox" name="pas-seven" id="seven">七天免登录
                                </label>
                            </span>
                            <span class="pas-forget">
                                <button type="button" name="pas-forget" id="pas-forget">忘记密码</button>
                            </span>
                        </div>
                        <div class="form-box4-but">
                            <button type="button" id="signP1">登录</button>
                        </div>
                    </form>
                </div>
                <div class="form-sign-oth">
                    <div class="form-sign-oth1">
                        <div class="sign-line"></div>
                        <div class="sign-wri">其他方式登录</div>
                        <div class="sign-line"></div>
                    </div>
                    <div class="form-sign-oth2">
                        <div class="form-oth2-icon1 iconfont" title="暂未开发~">&#xe600;</div>
                        <div class="form-oth2-icon2 iconfont" title="暂未开发~">&#xe882;</div>
                        <div class="form-oth2-icon3 iconfont" title="暂未开发~">&#xe618;</div>
                    </div>
                </div>
                <div class="form-agreement-box">
                    未注册手机验证后登录，注册即代表同意
                    <a href="javascript:;">《知乎协议》</a>
                    <a href="javascript:;">《隐私保护指引》</a>
                </div>
            </div>
            <div class="form-box-find">
                <div class="find-box">
                    <div class="find-tit">忘记密码</div>
                    <div class="form-sign-box2">
                        <input type="number" name="phone" id="phone3" placeholder="手机号" autocomplete="on">
                    </div>
                    <div class="form-sign-box2">
                        <input type="text" name="userName" id="username3" placeholder="请输入用户名">
                    </div>
                    <div class="form-sign-box2">
                        <input type="password" name="password" id="password3" placeholder="请输入密码">
                    </div>
                    <div class="form-box4-but">
                        <button type="button" id="sign2P1">重设密码</button>
                    </div>
                </div>
            </div>
        </div>
        <div class="page1-buttom-box">
            <div class="buttom-menu-box1">
                <a href="javascript:;">知乎专栏</a>
                <a href="javascript:;">·圆桌</a>
                <a href="javascript:;">·发现</a>
                <a href="javascript:;">·移动应用</a>
                <a href="javascript:;">·联系我们</a>
                <a href="javascript:;">·来知乎工作</a>
                <a href="javascript:;">·注册机构号</a>
                <a href="javascript:;">·Investor Relations</a>
            </div>
            <div class="buttom-memu-box2">
                <span>© 2021 知乎</span>&nbsp;
                <a href="javascript:;">京 ICP 证 110745 号</a>&nbsp;
                <a href="javascript:;">京 ICP 备 13052560 号 - 1</a>&nbsp;
                <img src="images/page1-but.png" alt="罢工噜">&nbsp;
                <a href="javascript:;">京公网安备 11010802020088 号</a>&nbsp;
                <a href="javascript:;">京网文[2022]2674-081 号</a>&nbsp;
                <a href="javascript:;">出版物经营许可证</a>&nbsp;
                <a href="javascript:;">药品信息服务资格证书（京）网药械信息备字（2022） 第00334号</a>
            </div>
            <div class="buttom-memu-box3">
                <a href="javascript:;">侵权举报</a>
                <a href="javascript:;">网上有害信息举报专区</a>
                <a href="javascript:;">儿童色情信息举报专区</a>
                <a href="javascript:;">互联网算法举报专区</a>
                <span>违法和不良信息举报：010-82716601</span>
                <span>举报邮箱：jubao@zhihu.com</span>
            </div>
            <div class="buttom-memu-box4">
                <img src="images/page1-but2.png" alt="罢工噜">
            </div>
        </div>
    </div>

    <!-- page2-首页 -->
    <div class="page2-boss boss">
        <div class="page2-nav">
            <div class="page2-nav-scroll">
                <div class="page2-nav1-box">
                    <div class="page2-top-logo1 logo1 logo"></div>
                    <div class="page2-nav1-box1">
                        <ul>
                            <li><a href="javascript:;" class="page2-nav1-a1">首页</a></li>
                            <li><a href="javascript:;">知学堂</a></li>
                            <li><a href="javascript:;">会员</a></li>
                            <li><a href="javascript:;">发现</a></li>
                            <li><a href="javascript:;">等你来答</a></li>
                        </ul>
                    </div>
                    <div class="page2-nav1-box2">
                        <div class="nav2-1-box2-sea">
                            <div class="nav2-1-box2-input">
                                <input type="text" maxlength="100" placeholder="前端转前台 后端转后厨" class="input-nav">
                            </div>
                            <div class="nav2-1-box2-svg iconfont">&#xe637;</div>
                        </div>
                        <div class="nav2-1-box2-but">
                            <button>提问</button>
                        </div>
                    </div>
                    <div class="page2-nav1-box3">
                        <ul>
                            <li class="nav2-1-box3-but1">
                                <a href="javascript">
                                    <div class="nav2-1-box3-svg iconfont">&#xe670;</div>
                                    <div class="nav2-1-box3-text">消息</div>
                                </a>
                            </li>
                            <li class="nav2-1-box3-but2">
                                <a href="javascript">
                                    <div class="nav2-2-box3-svg iconfont">&#xe802;</div>
                                    <div class="nav2-2-box3-text">私信</div>
                                </a>
                            </li>
                            <li class="nav2-1-box3-but3">
                                <a href="javascript">
                                    <div class="nav2-2-box3-svg iconfont">&#xe623;</div>
                                    <div class="nav2-2-box3-text">创作中心</div>
                                </a>
                            </li>
                            <li class="nav2-1-box3-but4 navImg">
                                <img src="images/avatar.jpg" alt="罢工噜" class="avatar">
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="page2-nav2-box">
                    <div class="page2-top-logo2 logo1"></div>
                    <div class="page2-nav2-box1">
                        <ul>
                            <li><a href="javascript:;" class="left2-1-a2 page2-blue">推荐</a></li>
                            <li><a href="javascript:;" class="left2-1-a3">热榜</a></li>
                            <li><a href="javascript:;" class="left2-1-a4">综合</a></li>

                        </ul>
                    </div>
                    <div class="page2-nav2-box2">
                        <div class="nav2-1-box2-sea">
                            <div class="nav2-1-box2-input">
                                <input type="text" maxlength="100" placeholder="搜索你感兴趣的内容..." class="input-nav">
                            </div>
                            <div class="nav2-1-box2-svg iconfont">&#xe637;</div>
                        </div>
                        <div class="nav2-1-box2-but">
                            <button>提问</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="page2-content">
            <div class="page2-content-left">
                <div class="left2-1-box1">
                    <ul>
                        <li><a href="javascript:;" class="left2-1-a2 page2-blue">推荐</a></li>
                        <li><a href="javascript:;" class="left2-1-a3">热榜</a></li>
                        <li><a href="javascript:;" class="left2-1-a4">综合</a></li>
                    </ul>
                </div>
                <!-- left2-1-box2    第二页左部分-第一板块-第二个盒子 -->
                <!-- 推荐文章板块 -->
                <div class="left2-1-box2">
                    <div class="left2-1-box2-tit">
                        <a href="javascript:;" class="btn1P2 fuzzy">推荐-文章详情页(静态页面仅用于展示模糊搜索/没全接口)</a>
                    </div>
                    <a href="javascript:;">
                        <div class="left2-1-box2-wri1">
                            <div class="left2-1-box2-wri1-1">
                                <span class="left2-1-box2-wri">
                                    gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~
                                </span>
                                <span class="left2-1-box2-ico">阅读全文<span class="iconfont">&#xee18;</span></span>
                            </div>
                        </div>
                        <div class="left2-1-box2-wri2">
                            <p>
                                gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~
                            </p>
                            <p>1</p>
                            <p>&emsp;2 </p>
                            <p>&emsp;&emsp;3 </p>
                            <p>&emsp;&emsp;&emsp;4 </p>
                        </div>
                    </a>
                    <div class="left2-1-box2-but">
                        <a href="javascript:;">
                            <div class="left2-1-but1 agreeBox">
                                <span class="left2-1-ico1 iconfont">&#xe615;</span>
                                <span class="left2-1-wri1">赞同 </span>
                                <span class="agreeNum"></span>
                            </div>
                        </a>
                        <a href="javascript:;">
                            <div class="left2-1-but2">
                                <div class="left2-1-ico2 iconfont">&#xe883;</div>
                            </div>
                        </a>
                        <a href="javascript:;">
                            <div class="left2-1-but3">
                                <div class="left2-1-ico3 iconfont">&#xe758;</div>
                                <span class=""></span> 条评论
                            </div>
                        </a>
                        <a href="javascript:;">
                            <div class="left2-1-but3">
                                <div class="left2-1-ico3 iconfont">&#xe606;</div> 分享
                            </div>
                        </a>
                        <a href="javascript:;">
                            <div class="left2-1-but3">
                                <div class="left2-1-ico3 iconfont">&#xe601;</div> 收藏
                            </div>
                        </a>
                        <a href="javascript:;">
                            <div class="left2-1-but3 likeBox">
                                <div class="left2-1-ico3 iconfont">&#xe65c;</div> 喜欢
                            </div>
                        </a>
                        <a href="javascript:;">
                            <div class="left2-1-but4">. . .</div>
                        </a>
                        <a href="javascript:;">
                            <div class="left2-1-but5 iconfont">收起 &#xe603;</div>
                        </a>
                    </div>
                </div>
                <div class="left2-1-box2">
                    <div class="left2-1-box2-tit">
                        <a href="javascript:;" class="btn1P2 fuzzy">文章详情页</a>
                    </div>
                    <a href="javascript:;">
                        <div class="left2-1-box2-wri1">
                            <div class="left2-1-box2-wri1-1">
                                <span class="left2-1-box2-wri">
                                    杰部分是文章内容
                                </span>
                                <span class="left2-1-box2-ico">阅读全文<span class="iconfont">&#xee18;</span></span>
                            </div>
                        </div>
                        <div class="left2-1-box2-wri2">
                            <p>
                                杰个是文章内容
                            </p>
                        </div>
                    </a>
                    <!-- left2-1-box2    左板块第二页-第一板块-第二个盒子 -->
                    <div class="left2-1-box2-but">
                        <a href="javascript:;">
                            <div class="left2-1-but1 agreeBox">
                                <span class="left2-1-ico1 iconfont">&#xe615;</span>
                                <span class="left2-1-wri1">赞同 </span>
                                <span class="agreeNum"></span>
                            </div>
                        </a>
                        <a href="javascript:;">
                            <div class="left2-1-but2">
                                <div class="left2-1-ico2 iconfont">&#xe883;</div>
                            </div>
                        </a>
                        <a href="javascript:;">
                            <div class="left2-1-but3">
                                <div class="left2-1-ico3 iconfont">&#xe758;</div>
                                <span class=""></span> 条评论
                            </div>
                        </a>
                        <a href="javascript:;">
                            <div class="left2-1-but3">
                                <div class="left2-1-ico3 iconfont">&#xe606;</div> 分享
                            </div>
                        </a>
                        <a href="javascript:;">
                            <div class="left2-1-but3">
                                <div class="left2-1-ico3 iconfont">&#xe601;</div> 收藏
                            </div>
                        </a>
                        <a href="javascript:;">
                            <div class="left2-1-but3">
                                <div class="left2-1-ico3 iconfont">&#xe65c;</div> 喜欢
                            </div>
                        </a>
                        <a href="javascript:;">
                            <div class="left2-1-but4">. . .</div>
                        </a>
                        <a href="javascript:;">
                            <div class="left2-1-but5 iconfont">收起 &#xe603;</div>
                        </a>
                    </div>
                </div>

                <!-- 热搜文章板块 -->
                <div class="left2-1-box3">
                    <div class="left2-1-box3-1">1</div>
                    <div class="left2-1-box3-2">
                        <!-- <div class="left2-1-box3-2-1"> -->
                        <a href="javascript:;" class="hot1P2 fuzzy">热搜-文章详情页（点击看详情）</a>
                        <!-- </div> -->
                        <div class="left2-1-box3-2-2"><a href="javascript:;" class="fixHeight">杰部分是热搜内容</a></div>
                        <div class="left2-1-box3-2-3">
                            <div class="left2-1-box3-2-mes1">
                                <span class="left2-1-box3-2-ico iconfont">&#xe68e;</span>热度
                            </div>
                            <div class="left2-1-box3-2-mes2">
                                <span class="left2-1-box3-2-ico iconfont">&#xe606;</span>分享
                            </div>
                        </div>
                    </div>
                    <div class="left2-1-box3-3"><a href="javascript:;"><img src="images/example.jpg" alt="罢工噜"></a>
                    </div>
                </div>

            </div>
            <div class="page2-content-right">
                <div class="right2-1">
                    <div class="right2-1-box1">
                        <div class="right2-1-ico1 iconfont">&#xe607;</div>
                        <div class="right2-1-wri1">
                            <div class="right2-1-tit">创作中心</div>
                            <div class="right2-1-Lv">Lv99</div>
                        </div>
                        <div class="right2-1-try">草稿箱(0)</div>
                    </div>
                    <div class="right2-1-box2">
                        <ul>
                            <li>
                                <a href="javascript:;" title="回答" class="right2-1-box2-a1">
                                    <div class="right2-1-box2-ico">
                                        <div class="right2-1-ico2 right2-1-box2-size iconfont">&#xe693;</div>
                                    </div>
                                    <div class="right2-1-wri2">回答问题</div>
                                </a>
                            </li>
                            <li>
                                <a href="javascript:;" title="发视频" class="right2-1-box2-a2">
                                    <div class="right2-1-box2-ico">
                                        <div class="right2-1-ico3 right2-1-box2-size iconfont">&#xe671;</div>
                                    </div>
                                    <div class="right2-1-wri2">发视频</div>
                                </a>
                            </li>
                            <li>
                                <a href="javascript:;" title="写文章" class="right2-1-box2-a3 writing">
                                    <div class="right2-1-box2-ico ">
                                        <div class="right2-1-ico4 right2-1-box2-size iconfont">&#xe6e3;</div>
                                    </div>
                                    <div class="right2-1-wri2">写文章</div>
                                </a>
                            </li>
                            <li>
                                <a href="javascript:;" title="写想法" class="right2-1-box2-a4">
                                    <div class="right2-1-box2-ico">
                                        <div class="right2-1-ico5 right2-1-box2-size iconfont">&#xe664;</div>
                                    </div>
                                    <div class="right2-1-wri2">写想法</div>
                                </a>
                            </li>
                        </ul>
                    </div>
                    <div class="right2-1-box3">
                        <div class="right2-1-box3-content"></div>
                    </div>
                    <div class="right2-1-box4">
                        <div class="right2-1-box4-0">
                            <div class="right2-1-box4-1">进入创作中心</div>
                            <div class="right2-1-box4-2">></div>
                        </div>
                    </div>
                </div>
                <div class="right2-2">
                    <div class="right2-2-box1">
                        <div class="right2-1-ico1 iconfont">&#xe608;</div>
                        <div class="right2-2-tit">推荐关注</div>
                    </div>
                    <div class="right2-2-box2"></div>
                    <div class="right2-2-box3">
                        <div class="right2-2-box3-1 iconfont">
                            <div class="ico">&#xe62c;</div>
                        </div>
                        <div class="right2-2-box3-2">1/3</div>
                        <div class="right2-2-box3-1 iconfont">
                            <div class="ico">&#xe62b;</div>
                        </div>
                    </div>
                </div>
                <div class="right2-3">
                    <ul>
                        <li>
                            <div class="right2-3-box wri-col1">
                                <div class="right2-3-ico iconfont ico-col1">&#xe655;</div>
                                <div class="right2-3-wri">Live</div>
                            </div>
                        </li>
                        <li>
                            <div class="right2-3-box wri-col2">
                                <div class="right2-3-ico iconfont ico-col2">&#xe634;</div>
                                <div class="right2-3-wri">书店</div>
                            </div>
                        </li>
                        <li>
                            <div class="right2-3-box wri-col3">
                                <div class="right2-3-ico iconfont ico-col3">&#xe639;</div>
                                <div class="right2-3-wri">圆桌</div>
                            </div>
                        </li>
                        <li>
                            <div class="right2-3-box wri-col4">
                                <div class="right2-3-ico iconfont ico-col4">&#xe602;</div>
                                <div class="right2-3-wri">专栏</div>
                            </div>
                        </li>
                        <li>
                            <div class="right2-3-box wri-col5">
                                <div class="right2-3-ico iconfont ico-col5">&#xe63e;</div>
                                <div class="right2-3-wri">付费咨询</div>
                            </div>
                        </li>
                        <li>
                            <div class="right2-3-box wri-col6">
                                <div class="right2-3-ico iconfont ico-col6">&#xe61a;</div>
                                <div class="right2-3-wri">百科</div>
                            </div>
                        </li>
                    </ul>
                </div>
                <div class="right2-4">
                    <a href="javascript:;">
                        <div class="right2-4-box">
                            <div class="right2-4-ico iconfont">&#xe601;</div>
                            <div class="right2-4-wri"> 我的收藏</div>
                            <div class="right2-4-num">0</div>
                        </div>
                    </a>
                    <a href="javascript:;">
                        <div class="right2-4-box">
                            <div class="right2-4-ico iconfont">&#xeb69;</div>
                            <div class="right2-4-wri">我关注的问题</div>
                        </div>
                    </a>
                    <a href="javascript:;">
                        <div class="right2-4-box">
                            <div class="right2-4-ico iconfont">&#xe608;</div>
                            <div class="right2-4-wri">我的邀请</div>
                        </div>
                    </a>
                    <a href="javascript:;">
                        <div class="right2-4-box">
                            <div class="right2-4-ico iconfont">&#xe697;</div>
                            <div class="right2-4-wri">我的余额</div>
                        </div>
                    </a>
                    <a href="javascript:;">
                        <div class="right2-4-box">
                            <div class="right2-4-ico iconfont">&#xe619;</div>
                            <div class="right2-4-wri">我的礼券</div>
                        </div>
                    </a>
                    <a href="javascript:;">
                        <div class="right2-4-box">
                            <div class="right2-4-ico iconfont">&#xe616;</div>
                            <div class="right2-4-wri">站务中心</div>
                        </div>
                    </a>
                    <a href="javascript:;">
                        <div class="right2-4-box">
                            <div class="right2-4-ico iconfont">&#xe625;</div>
                            <div class="right2-4-wri">帮忙与客服</div>
                        </div>
                    </a>
                    <a href="javascript:;">
                        <div class="right2-4-box">
                            <div class="right2-4-ico iconfont">&#xe67a;</div>
                            <div class="right2-4-wri">版权服务中心</div>
                        </div>
                    </a>
                </div>
                <div class="right2-5">
                    <a href="https://liukanshan.zhihu.com/">刘看山</a>
                    <span>·</span>
                    <a href="javascript:;">A乎指南</a>
                    <span>·</span>
                    <a href="javascript:;">A乎指协议</a>
                    <span>·</span>
                    <a href="javascript:;">A乎隐私保护指引</a>
                    <br>
                    <a href="javascript:;">应用</a>
                    <span>·</span>
                    <a href="javascript:;">工作</a>
                    <span>·</span>
                    <a href="javascript:;">申请开通A乎机构号</a>
                    <br>
                    <a href="javascript:;">侵权举报</a>
                    <span>·</span>
                    <a href="javascript:;">网上有害信息举报专区</a>
                    <br>
                    <a href="javascript:;">京ICP证 1010** 号</a>
                    <br>
                    <a href="javascript:;">京ICP备 101010** 号 - 1</a>
                    <br>
                    <a href="javascript:;"><img src="images/page1-but.png" alt="罢工噜">京公网安备121212121212** 号</a>
                    <br>
                    <a href="javascript:;">京网文[2023]1234-567 号</a>
                    <br>
                    <a href="javascript:;">药品医疗器械网络信息服务备案</a>
                    <br>
                    <a href="javascript:;">（京）网药械信息备字（2023）第00000号</a>
                    <br>
                    <a href="javascript:;">服务热线： 400-919-0001</a>
                    <br>
                    <a href="javascript:;">违法和不良信息举报：010-82716601</a>
                    <br>
                    <a href="javascript:;">举报邮箱：jubao@zhihu.com</a>
                    <br>
                    <a href="javascript:;">儿童色情信息举报专区</a>
                    <br>
                    <a href="javascript:;">互联网算法举报专区</a>
                    <br>
                    <a href="javascript:;">养老诈骗举报专区</a>
                    <br>
                    <a href="javascript:;">MCN举报专区</a>
                    <br>
                    <a href="javascript:;">信息安全漏洞反馈专区</a>
                    <br>
                    <a href="javascript:;">内容从业人员违法违规学委举报</a>
                    <br>
                    <a href="javascript:;">网络谣言信息举报专区</a>
                    <br>
                    <a href="javascript:;">自媒体乱象举报专区</a>
                    <br>
                    <a href="javascript:;">证照中心 · Investor Relations</a>
                    <br>
                    <a href="javascript:;" class="iconfont">联系我们&#xe67a;2023 A乎</a>
                    <br>
                    <a href="javascript:;">广东智者地上科技无限公司版权所有</a>
                    <br>
                    <img src="images/page1-but2.png" alt="罢工噜">
                </div>
            </div>
        </div>
    </div>

    <!-- page3-问题详情页 -->
    <div class="page3-boss boss">
        <div class="page3-nav">
            <div class="page3-nav-scroll">
                <div class="page2-nav1-box">
                    <div class="page2-top-logo1 logo1 logo"></div>
                    <div class="page2-nav1-box1">
                        <ul>
                            <li><a href="javascript:;">首页</a></li>
                            <li><a href="javascript:;">知学堂</a></li>
                            <li><a href="javascript:;">会员</a></li>
                            <li><a href="javascript:;">发现</a></li>
                            <li><a href="javascript:;">等你来答</a></li>
                        </ul>
                    </div>
                    <div class="page2-nav1-box2">
                        <div class="nav2-1-box2-sea">
                            <div class="nav2-1-box2-input">
                                <input type="text" maxlength="100" placeholder="前端转前台 后端转后厨" class="input-nav">
                            </div>
                            <div class="nav2-1-box2-svg iconfont">&#xe637;</div>
                        </div>
                        <div class="nav2-1-box2-but">
                            <button>提问</button>
                        </div>
                    </div>
                    <div class="page2-nav1-box3">
                        <ul>
                            <li class="nav2-1-box3-but1">
                                <a href="javascript:;">
                                    <div class="nav2-1-box3-svg iconfont">&#xe670;</div>
                                    <div class="nav2-1-box3-text">消息</div>
                                </a>
                            </li>
                            <li class="nav2-1-box3-but2">
                                <a href="javascript:;">
                                    <div class="nav2-2-box3-svg iconfont">&#xe802;</div>
                                    <div class="nav2-2-box3-text">私信</div>
                                </a>
                            </li>
                            <li class="nav2-1-box3-but3">
                                <a href="javascript:;">
                                    <div class="nav2-2-box3-svg iconfont">&#xe623;</div>
                                    <div class="nav2-2-box3-text">创作中心</div>
                                </a>
                            </li>
                            <li class="nav2-1-box3-but4 navImg">
                                <img src="images/avatar.jpg" alt="罢工噜" class="avatar">
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="page3-nav2-box">
                    <div class="page3-nav2-box1">
                        你霉看错，杰是个标题喔
                    </div>
                    <div class="page3-nav2-box2">
                        <a href="javascript:;">
                            <div class="nav3-2-but1">关注问题</div>
                        </a>
                        <a href="javascript:;">
                            <div class="nav3-2-but2">
                                <div class="nav3-2-but2-ico iconfont">&#xe602;</div>
                                <div class="nav3-2-but2-wri">写问题</div>
                            </div>
                        </a>
                    </div>
                    <div class="page3-nav2-box3">
                        <img src="images/page5-peo1.jpg" alt="罢工噜" class="avatarOther">
                    </div>
                </div>
            </div>
        </div>
        <div class="page3-main">
            <div class="page3-header">
                <div class="header3-1-box1">
                    <div class="header3-1-box1-1">
                        <div class="header3-1-left-tip">
                            前端开发
                        </div>
                        <div class="header3-1-left-tit">
                            你霉看错，杰是个标题喔
                        </div>
                        <div class="header3-1-left-wri">
                            gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~<br>
                            gu~
                        </div>
                    </div>
                    <div class="header3-1-box1-2">
                        <div class="header3-1-right1">
                            <div class="header3-1-right-tit">关注者</div>
                            <div class="header3-1-right-num">15,440</div>
                        </div>
                        <div class="header3-1-right2">
                            <div class="header3-1-right-tit">被浏览</div>
                            <div class="header3-1-right-num">2,023,415</div>
                        </div>
                    </div>
                </div>
                <div class="header3-1-box2">
                    <div class="header3-1-box2-1">
                        <a href="javascript:;">
                            <div class="nav3-2-but1">关注问题</div>
                        </a>
                        <a href="javascript:;">
                            <div class="nav3-2-but2">
                                <div class="nav3-2-but2-ico iconfont">&#xe602;</div>
                                <div class="nav3-2-but2-wri">写问题</div>
                            </div>
                        </a>
                    </div>
                    <div class="header3-1-box2-2">
                        <a href="javascript:;">
                            <div class="header3-1-box2-2-but1 header3-1-border">
                                <div class="header3-1-but1 iconfont">&#xe608;</div> 邀请回答
                            </div>
                        </a>
                        <a href="javascript:;">
                            <div class="header3-1-box2-2-but1">
                                <div class="header3-1-but1  iconfont">&#xe8c3;</div> 好问题
                            </div>
                        </a>
                        <a href="javascript:;">
                            <div class="header3-1-box2-2-but1">
                                <div class="header3-1-but1  iconfont">&#xe758;</div>
                                <span class=""></span>
                                条评论
                            </div>
                        </a>
                        <a href="javascript:;">
                            <div class="header3-1-box2-2-but1">
                                <div class="header3-1-but1  iconfont">&#xe606;</div> 分享
                            </div>
                        </a>
                        <a href="javascript:;">
                            <div class="header3-1-box2-2-but1 header3-1-tra">
                                . . .
                            </div>
                        </a>
                    </div>

                </div>
            </div>
            <div class="page3-content">
                <div class="page3-content-left">
                    <div class="left3-1">
                        <a href="javascript:;">
                            查看全部 个问题
                        </a>
                    </div>
                    <div class="left3-2">
                        <div class="left3-2-box1">
                            <div class="left3-2-1-img">
                                <img src="images/page5-peo1.jpg" alt="罢工噜" class="avatarOther">
                            </div>
                            <div class="left3-2-1-wri">
                                <div class="left3-2-1-name ">
                                    <a href="javascript:;">
                                        Name
                                    </a>
                                </div>
                                <div class="left3-2-1-word">
                                    word
                                </div>
                            </div>
                            <div class="left3-2-1-but">
                                <a href="javascripy:;">
                                    + 关注
                                </a>
                            </div>
                        </div>
                        <div class="left3-2-box2">
                            人赞同了该回答
                        </div>
                        <div class="right3-2-box3">
                        </div>
                        <div class="right3-2-box4">
                            <div class="left2-1-box2-but">
                                <a href="javascript:;">
                                    <div class="left2-1-but1">
                                        <span class="left2-1-ico1 iconfont">&#xe615;</span>
                                        <span class="left2-1-wri1">赞同</span>
                                        <span class="agreeNum"></span>
                                    </div>
                                </a>
                                <a href="javascript:;">
                                    <div class="left2-1-but2">
                                        <div class="left2-1-ico2 iconfont">&#xe883;</div>
                                    </div>
                                </a>
                                <a href="javascript:;">
                                    <div class="left2-1-but3">
                                        <div class="left2-1-ico3 iconfont">&#xe758;</div>
                                        <span class=""></span>
                                        条评论
                                    </div>
                                </a>
                                <a href="javascript:;">
                                    <div class="left2-1-but3">
                                        <div class="left2-1-ico3 iconfont">&#xe606;</div> 分享
                                    </div>
                                </a>
                                <a href="javascript:;">
                                    <div class="left2-1-but3 collectBox">
                                        <div class="left2-1-ico3 iconfont">&#xe601;</div> 收藏
                                    </div>
                                </a>
                                <a href="javascript:;">
                                    <div class="left2-1-but3">
                                        <div class="left2-1-ico3 iconfont">&#xe65c;</div> 喜欢
                                    </div>
                                </a>
                                <a href="javascript:;">
                                    <div class="left2-1-but4">. . .</div>
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="page3-content-right">
                    <div class="right3-1">
                        <div class="right3-1-box1">
                            <div class="right3-1-1">
                                <a href="javascript:;">
                                    关于作者
                                </a>
                            </div>
                            <div class="right3-1-2">
                                <div class="right3-1-2-img">
                                    <img src="images/page5-peo1.jpg" alt="罢工噜" class="avatarOther">
                                </div>
                                <div class="right3-1-2-wri">
                                    <div class="right3-1-2- userNameHot">
                                        <a href="javascript:;">
                                            Name
                                        </a>
                                    </div>
                                    <div class="right3-1-2-word">
                                        word
                                    </div>
                                </div>
                            </div>
                            <div class="right3-1-3">
                                <div class="right3-1-3-data">
                                    <a href="javascript:;">
                                        <div class="right3-1-3-tit">回答</div>
                                        <div class="right3-1-3-num">1</div>
                                    </a>
                                    <a href="javascript:;">
                                        <div class="right3-1-3-tit">文章</div>
                                        <div class="right3-1-3-num">2</div>
                                    </a>
                                    <a href="javascript:;">
                                        <div class="right3-1-3-tit">关注者</div>
                                        <div class="right3-1-3-num">3</div>
                                    </a>
                                </div>
                                <div class="right3-1-3-but">

                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- page4-1-推荐-文章详情页 用于发布文章做模板 -->
    <div class="page4-1-boss boss">
        <div class="page4-nav">
            <div class="page4-nav-scroll">
                <div class="page2-top-logo1 logo1 logo"></div>
                <div class="nav4-1">
                    <div class="nav4-1-1">. . .</div>
                    <div class="nav4-1-2 writing">
                        <a href="javascript:;">
                            <div class="nav4-1-2-ico iconfont">&#xe636;</div>
                            <div class="nav4-1-2-wri">写文章</div>
                        </a>
                    </div>
                    <div class="nav4-1-3">
                        <div class="navImg">
                            <img src="images/avatar.jpg" alt="罢工噜" class="avatar">
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="page4-content">
            <div class="page4-flx-but">
                <div class="page4-flx-but1 agreeBox">
                    <a href="javascript:;">
                        <div class="page4-flx-1-ico iconfont">&#xe615;</div>
                        <div class="page4-flx-wri">赞同
                            <span class="agreeMyNum"></span>
                        </div>
                    </a>
                </div>
                <div class="page4-flx-but2">
                    <a href="javascript:;">
                        <div class="page4-flx-2-ico iconfont">&#xe606;</div>
                        <div class="page4-flx-wri">分享</div>
                    </a>
                </div>
            </div>
            <div class="content4-box1">
                <img src="images/pic.jpg" alt="罢工噜" class="preview">
            </div>
            <div class="content4-box2">
                <div class="content4-2-tit">
                    <a href="javascript:;">推荐1-文章详情页(静态页面用于展示/点击)</a>
                </div>
                <div class="content4-2-post">
                    <div class="content4-2-img">
                        <img src="images/avatar.jpg" alt="罢工噜" class="avatar  myClick">
                    </div>
                    <div class="content4-2-head">
                        <div class="userName content4-2-head-tit">作者用户名</div>
                    </div>
                    <a href="javascript:;">
                        <div class="content5-l1-peo2-but attentionOther">
                            <div><button class="content5-l1-peo2-but1">已关注</button></div>
                            <div><button class="content5-l1-peo2-but2">
                                    <span class="content5-l1-peo1-ico2">+</span>关注ta</button>
                            </div>
                        </div>
                    </a>
                </div>
            </div>
            <div class="content4-box3">
                <span class="agreeNum"></span>
                人赞同了该文章
            </div>
            <div class="content4-box4">
                <p>
                    gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~<br>
                    gu~ <br>
                    1 <br>
                    &emsp;2 <br>
                    &emsp;&emsp;3 <br>
                    &emsp;&emsp;&emsp;4 <br>
                </p>
            </div>
            <!-- <div class="content4-box5">
                编辑于<span> 2023-04-15 1: 39 </span>· IP 属地广东
            </div> -->
            <div class="content4-box6">
                <a href="javascript:;">
                    <div class="content4-6-tip">
                        前端开挖
                    </div>
                </a>
            </div>
            <div class="content4-box7">
                <div class="left2-1-box2-but">
                    <a href="javascript:;">
                        <div class="left2-1-but1 agreeBox">
                            <span class="left2-1-ico1 iconfont">&#xe615;</span>
                            <span class="left2-1-wri1">赞同</span>
                            <span class="agreeMyNum"></span>
                        </div>
                    </a>
                    <a href="javascript:;">
                        <div class="left2-1-but2 downBox">
                            <div class="left2-1-ico2 iconfont">&#xe883;</div>
                        </div>
                    </a>
                    <a href="javascript:;">
                        <div class="left2-1-but3">
                            <div class="left2-1-ico3 iconfont">&#xe758;</div>
                            <span class="comNum"></span>
                            条评论
                        </div>
                    </a>
                    <a href="javascript:;">
                        <div class="left2-1-but3">
                            <div class="left2-1-ico3 iconfont">&#xe606;</div> 分享
                        </div>
                    </a>
                    <a href="javascript:;">
                        <div class="left2-1-but3 collectBox">
                            <div class="left2-1-ico3 iconfont">&#xe601;</div> 收藏
                        </div>
                    </a>
                    <a href="javascript:;">
                        <div class="left2-1-but3">
                            <div class="left2-1-ico3 iconfont">&#xe65c;</div> 喜欢
                        </div>
                    </a>
                    <a href="javascript:;">
                        <div class="left2-1-but3">
                            <div class="left2-1-ico3 iconfont">&#xee17;</div> 申请转载
                        </div>
                    </a>
                    <a href="javascript:;">
                        <div class="left2-1-but4">. . .</div>
                    </a>
                </div>
            </div>
            <div class="content4-box8">
                <img src="images/avatar.jpg" alt="罢工噜" class="avatar navImg myClick">
                <div class="content4-8-wri">
                    <div class="content4-8-top">
                        <div class="content4-8-input">
                            <input type="text" placeholder="评论第一条，友善第一条" class="content4-8-input content4-8-input1">
                            <input type="text" placeholder="评论第一条，友善第一条"
                                class="content4-8-input content4-8-input2 contentUp">
                            <div class="content4-8-bot content4-8-input2">
                                <div class="content4-8-all">
                                    <a href="javascript:;">
                                        <div class="content4-8-ico iconfont" title="暂未开发">&#xe62d;</div>
                                    </a>
                                    <a href="javascript:;">
                                        <div class="content4-8-ico iconfont" title="暂未开发">&#xe624;</div>
                                    </a>
                                </div>
                                <button class="content4-8-but">发布</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="content4-box9">
                <div class="content4-9-left">
                    <span class="comNum"> </span>
                    条评论
                </div>
                <div class="content4-9-right">
                    <div class="right4-9-r1">默认</div>
                    <div class="right4-9-r2">最新</div>
                </div>
            </div>
            <div class="content4-box10">
                <div class="content4-10-com">
                    <div class="content4-10-img">
                        <a href="javascriipt:;">
                            <img src="images/avatar.jpg" alt="罢工噜" class="avatar myClick">
                        </a>
                    </div>
                    <div class="content4-10-box">
                        <div class="content4-10-box1">
                            <a href="javascript:;">
                                <div class="content4-10-1-name userName">Name</div>
                            </a>
                            <a href="javascript:;">
                                <div class="content4-10-1-more">. . .</div>
                            </a>
                        </div>
                        <div class="content4-10-box2">届是条评论</div>
                        <div class="content4-10-box3">
                            <!-- <div class="content4-10-left"><span> 04-16 </span>· IP 属地<span> 广东</span></div> -->
                            <div class="content4-10-right">
                                <a href="javascript:;">
                                    <div class="content4-10-3-r1 delCom">
                                        <div class="content4-10-3-ico iconfont">&#xe7ce;</div>
                                        <div class="content4-10-3-wri ">删除</div>
                                    </div>
                                </a>
                                <a href="javascript:;" class="comBack">
                                    <div class="content4-10-3-r2">
                                        <div class="content4-10-3-ico iconfont">&#xe758;</div>
                                        <div class="content4-10-3-wri">回复</div>
                                    </div>
                                </a>
                                <a href="javascript:;">
                                    <div class="content4-10-3-r3 agreeComBox">
                                        <div class="content4-10-3-ico iconfont agreeColor">&#xe8c3;</div>
                                        <div class="content4-10-3-wri2 agreeComNum">0</div>
                                    </div>
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- 静态示例 用js copy了俩 评论区类名是共用的 -->
    <div class="page4-1-boss boss">
        <div class="page4-nav">
            <div class="page4-nav-scroll">
                <div class="page2-top-logo1 logo1 logo"></div>
                <div class="nav4-1">
                    <div class="nav4-1-1">. . .</div>
                    <div class="nav4-1-2 writing">
                        <a href="javascript:;">
                            <div class="nav4-1-2-ico iconfont">&#xe636;</div>
                            <div class="nav4-1-2-wri">写文章</div>
                        </a>
                    </div>
                    <div class="nav4-1-3">
                        <div class="navImg">
                            <img src="images/avatar.jpg" alt="罢工噜" class="avatar">
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="page4-content">
            <div class="content4-box1">
                <img src="images/pic.jpg" alt="罢工噜" class="preview">
            </div>
            <div class="content4-box2">
                <div class="content4-2-tit">
                    <a href="javascript:;">推荐1-文章详情页(静态页面用于展示/点击)</a>
                </div>
                <div class="content4-2-post">
                    <div class="content4-2-img">
                        <img src="images/page5-peo1.jpg" alt="罢工噜" class="avatarOther">
                    </div>
                    <div class="content4-2-head">
                        <div class="userNameOther content4-2-head-tit">作者用户名</div>
                    </div>
                    <a href="javascript:;">
                        <div class="content5-l1-peo2-but attentionOther">
                            <div><button class="content5-l1-peo2-but1">已关注</button></div>
                            <div><button class="content5-l1-peo2-but2">
                                    <span class="content5-l1-peo1-ico2">+</span>关注ta</button>
                            </div>
                        </div>
                    </a>
                </div>
            </div>
            <div class="content4-box3">
                <span class="agreeNum"></span>
                人赞同了该文章
            </div>
            <div class="content4-box4">
                <p>
                    gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~gu~<br>
                    gu~ <br>
                    1 <br>
                    &emsp;2 <br>
                    &emsp;&emsp;3 <br>
                    &emsp;&emsp;&emsp;4 <br>
                </p>
            </div>
            <!-- <div class="content4-box5">
                编辑于<span> 2023-04-15 1: 39 </span>· IP 属地广东
            </div> -->
            <div class="content4-box6">
                <a href="javascript:;">
                    <div class="content4-6-tip">
                        前端开挖
                    </div>
                </a>
            </div>
            <div class="content4-box7">
                <div class="left2-1-box2-but">
                    <a href="javascript:;">
                        <div class="left2-1-but1 agreeBox">
                            <span class="left2-1-ico1 iconfont">&#xe615;</span>
                            <span class="left2-1-wri1">赞同</span>
                        </div>
                    </a>
                    <a href="javascript:;">
                        <div class="left2-1-but2">
                            <div class="left2-1-ico2 iconfont">&#xe883;</div>
                        </div>
                    </a>
                    <a href="javascript:;">
                        <div class="left2-1-but3">
                            <div class="left2-1-ico3 iconfont">&#xe758;</div>
                            <span class=""></span>
                            条评论
                        </div>
                    </a>
                    <a href="javascript:;">
                        <div class="left2-1-but3">
                            <div class="left2-1-ico3 iconfont">&#xe606;</div> 分享
                        </div>
                    </a>
                    <a href="javascript:;">
                        <div class="left2-1-but3">
                            <div class="left2-1-ico3 iconfont">&#xe601;</div> 收藏
                        </div>
                    </a>
                    <a href="javascript:;">
                        <div class="left2-1-but3">
                            <div class="left2-1-ico3 iconfont">&#xe65c;</div> 喜欢
                        </div>
                    </a>
                    <a href="javascript:;">
                        <div class="left2-1-but3">
                            <div class="left2-1-ico3 iconfont">&#xee17;</div> 申请转载
                        </div>
                    </a>
                    <a href="javascript:;">
                        <div class="left2-1-but4">. . .</div>
                    </a>
                </div>
            </div>
            <div class="content4-box8">
                <img src="images/avatar.jpg" alt="罢工噜" class="avatar myClick">
                <div class="content4-8-wri">
                    <div class="content4-8-top">
                        <div class="content4-8-input">
                            <input type="text" placeholder="评论第一条，友善第一条" class="content4-8-input content4-8-input1">
                            <input type="text" placeholder="评论第一条，友善第一条"
                                class="content4-8-input content4-8-input2 contentUp">
                            <div class="content4-8-bot content4-8-input2">
                                <div class="content4-8-all">
                                    <a href="javascript:;">
                                        <div class="content4-8-ico iconfont" title="暂未开发">&#xe62d;</div>
                                    </a>
                                    <a href="javascript:;">
                                        <div class="content4-8-ico iconfont" title="暂未开发">&#xe624;</div>
                                    </a>
                                </div>
                                <button class="content4-8-but">发布</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="content4-box9">
                <div class="content4-9-left">
                    <span class=""> </span>
                    条评论
                </div>
                <div class="content4-9-right">
                    <div class="right4-9-r1">默认</div>
                    <div class="right4-9-r2">最新</div>
                </div>
            </div>
            <div class="content4-box10">
                <div class="content4-10-com">
                    <div class="content4-10-img">
                        <a href="javascriipt:;">
                            <img src="images/avatar.jpg" alt="罢工噜" class="avatar myClick">
                        </a>
                    </div>
                    <div class="content4-10-box">
                        <div class="content4-10-box1">
                            <a href="javascript:;">
                                <div class="content4-10-1-name userName">Name</div>
                            </a>
                            <a href="javascript:;">
                                <div class="content4-10-1-more">. . .</div>
                            </a>
                        </div>
                        <div class="content4-10-box2">届是条评论</div>
                        <div class="content4-10-box3">
                            <!-- <div class="content4-10-left"><span> 04-16 </span>· IP 属地<span> 广东</span></div> -->
                            <div class="content4-10-right">
                                <a href="javascript:;">
                                    <div class="content4-10-3-r1 delCom">
                                        <div class="content4-10-3-ico iconfont">&#xe7ce;</div>
                                        <div class="content4-10-3-wri ">删除</div>
                                    </div>
                                </a>
                                <a href="javascript:;">
                                    <div class="content4-10-3-r2" class="comBack">
                                        <div class="content4-10-3-ico iconfont">&#xe758;</div>
                                        <div class="content4-10-3-wri">回复</div>
                                    </div>
                                </a>
                                <a href="javascript:;">
                                    <div class="content4-10-3-r3">
                                        <div class="content4-10-3-ico iconfont">&#xe8c3;</div>
                                        <div class="content4-10-3-wri2">0</div>
                                    </div>
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="page4-flx-but">
                    <div class="page4-flx-but1 agreeBox">
                        <a href="javascript:;">
                            <div class="page4-flx-1-ico iconfont">&#xe615;</div>
                            <div class="page4-flx-wri">赞同
                                <span class="agreeNum"></span>
                            </div>
                        </a>
                    </div>
                    <div class="page4-flx-but2">
                        <a href="javascript:;">
                            <div class="page4-flx-2-ico iconfont">&#xe606;</div>
                            <div class="page4-flx-wri">分享</div>
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- page4-2-热搜-文章详情页 -->
    <div class="page4-2-boss boss">
        <div class="page4-nav">
            <div class="page4-nav-scroll">
                <div class="page2-top-logo1 logo1 logo"></div>
                <div class="nav4-1">
                    <div class="nav4-1-1">. . .</div>
                    <div class="nav4-1-2 writing">
                        <a href="javascript:;">
                            <div class="nav4-1-2-ico iconfont">&#xe636;</div>
                            <div class="nav4-1-2-wri">写文章</div>
                        </a>
                    </div>
                    <div class="nav4-1-3">
                        <div class="navImg">
                            <img src="images/avatar.jpg" alt="罢工噜" class="avatar">
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="page4-content">
            <div class="content4-box1">
                <img src="images/example.jpg" alt="罢工噜" class="preview">
            </div>
            <div class="content4-box2">
                <div class="content4-2-tit">
                    <a href="javascript:;">热搜-文章详情页</a>
                </div>
                <div class="content4-2-post">
                    <div class="content4-2-img">
                        <img src="images/page5-peo1.jpg" alt="罢工噜" class="avatarOther">
                    </div>
                    <div class="content4-2-head">
                        <div class="content4-2-head-tit">作者用户名</div>
                    </div>

                    <a href="javascript:;">
                        <div class="content5-l1-peo2-but attentionOther">
                            <div><button class="content5-l1-peo2-but1">已关注</button></div>
                            <div><button class="content5-l1-peo2-but2">
                                    <span class="content5-l1-peo1-ico2">+</span>关注ta</button>
                            </div>
                        </div>
                    </a>
                </div>
            </div>
            <div class="content4-box3">
                <span class="agreeNum"></span>
                人赞同了该文章
            </div>
            <div class="content4-box4">
                <p>
                    杰个是热搜内容
                </p>
            </div>
            <div class="content4-box5">
                编辑于<span> 2023-04-15 1: 39 </span>· IP 属地<span> 广东</span>
            </div>
            <div class="content4-box6">
                <a href="javascript:;">
                    <div class="content4-6-tip">
                        hot
                    </div>
                </a>
            </div>
            <div class="content4-box7">
                <div class="left2-1-box2-but">
                    <a href="javascript:;">
                        <div class="left2-1-but1 agreeBox">
                            <span class="left2-1-ico1 iconfont">&#xe615;</span>
                            <span class="left2-1-wri1">赞同</span>
                            <span class="agreeNum"></span>
                        </div>
                    </a>
                    <a href="javascript:;">
                        <div class="left2-1-but2">
                            <div class="left2-1-ico2 iconfont">&#xe883;</div>
                        </div>
                    </a>
                    <a href="javascript:;">
                        <div class="left2-1-but3">
                            <div class="left2-1-ico3 iconfont">&#xe758;</div>
                            <span class=""> </span>
                            条评论
                        </div>
                    </a>
                    <a href="javascript:;">
                        <div class="left2-1-but3">
                            <div class="left2-1-ico3 iconfont">&#xe606;</div> 分享
                        </div>
                    </a>
                    <a href="javascript:;">
                        <div class="left2-1-but3">
                            <div class="left2-1-ico3 iconfont">&#xe601;</div> 收藏
                        </div>
                    </a>
                    <a href="javascript:;">
                        <div class="left2-1-but3">
                            <div class="left2-1-ico3 iconfont">&#xe65c;</div> 喜欢
                        </div>
                    </a>
                    <a href="javascript:;">
                        <div class="left2-1-but3">
                            <div class="left2-1-ico3 iconfont">&#xee17;</div> 申请转载
                        </div>
                    </a>
                    <a href="javascript:;">
                        <div class="left2-1-but4">. . .</div>
                    </a>
                </div>
            </div>
            <div class="content4-box8">
                <img src="images/avatar.jpg" alt="罢工噜" class="avatar">
                <div class="content4-8-wri">
                    <div class="content4-8-top">
                        <div class="content4-8-input">
                            <input type="text" placeholder="评论第一条，友善第一条" class="content4-8-input content4-8-input1">
                            <input type="text" placeholder="评论第一条，友善第一条" class="content4-8-input content4-8-input2">
                            <div class="content4-8-bot content4-8-input2">
                                <div class="content4-8-all">
                                    <a href="javascript:;">
                                        <div class="content4-8-ico iconfont" title="暂未开发">&#xe62d;</div>
                                    </a>
                                    <a href="javascript:;">
                                        <div class="content4-8-ico iconfont" title="暂未开发">&#xe624;</div>
                                    </a>
                                </div>
                                <button class="content4-8-but">发布</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="content4-box9">
                <div class="content4-9-left">
                    <span class=""> </span>
                    条评论
                </div>
                <div class="content4-9-right">
                    <div class="right4-9-r1">默认</div>
                    <div class="right4-9-r2">最新</div>
                </div>
            </div>
            <div class="content4-box10">
                <div class="content4-10-com">
                    <div class="content4-10-img">
                        <a href="javascriipt:;">
                            <img src="images/avatar.jpg" alt="罢工噜" class="avatar">
                        </a>
                    </div>
                    <div class="content4-10-box">
                        <div class="content4-10-box1">
                            <a href="javascript:;">
                                <div class="content4-10-1-name userName">Name</div>
                            </a>
                            <a href="javascript:;">
                                <div class="content4-10-1-more">. . .</div>
                            </a>
                        </div>
                    </div>
                    <div class="content4-10-box2">届是条评论</div>
                    <div class="content4-10-box3">
                        <div class="content4-10-left"><span> 04-16 </span>· IP 属地<span> 广东</span></div>
                        <div class="content4-10-right">
                            <a href="javascript:;" class="comBack">
                                <div class="content4-10-3-r1">
                                    <div class="content4-10-3-ico iconfont">&#xe758;</div>
                                    <div class="content4-10-3-wri">回复</div>
                                </div>
                            </a>
                            <a href="javascript:;">
                                <div class="content4-10-3-r2">
                                    <div class="content4-10-3-ico iconfont">&#xe8c3;</div>
                                    <div class="content4-10-3-wri2">0</div>
                                </div>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
            <div class="page4-flx-but">
                <div class="page4-flx-but1 agreeBox">
                    <a href="javascript:;">
                        <div class="page4-flx-1-ico iconfont">&#xe615;</div>
                        <div class="page4-flx-wri">赞同</div>
                        <span class="agreeNum"></span>
                    </a>
                </div>
                <div class="page4-flx-but2">
                    <a href="javascript:;">
                        <div class="page4-flx-2-ico iconfont">&#xe606;</div>
                        <div class="page4-flx-wri">分享</div>
                    </a>
                </div>
            </div>

        </div>
    </div>
    <!-- page5-个人中心页 -->
    <div class="page5-boss boss">
        <div class="page5-nav">
            <div class="page5-nav-scroll">
                <div class="page2-nav1-box">
                    <div class="page2-top-logo1 logo1 logo"></div>
                    <div class="page2-nav1-box1">
                        <ul>
                            <li><a href="javascript:;">首页</a></li>
                            <li><a href="javascript:;">知学堂</a></li>
                            <li><a href="javascript:;">会员</a></li>
                            <li><a href="javascript:;">发现</a></li>
                            <li><a href="javascript:;">等你来答</a></li>
                        </ul>
                    </div>
                    <div class="page2-nav1-box2">
                        <div class="nav2-1-box2-sea">
                            <div class="nav2-1-box2-input">
                                <input type="text" maxlength="100" placeholder="前端转前台 后端转后厨" class="input-nav">
                            </div>
                            <div class="nav2-1-box2-svg iconfont">&#xe637;</div>
                        </div>
                        <div class="nav2-1-box2-but">
                            <button>提问</button>
                        </div>
                    </div>
                    <div class="page2-nav1-box3">
                        <ul>
                            <li class="nav2-1-box3-but1">
                                <a href="javascript">
                                    <div class="nav2-1-box3-svg iconfont">&#xe670;</div>
                                    <div class="nav2-1-box3-text">消息</div>
                                </a>
                            </li>
                            <li class="nav2-1-box3-but2">
                                <a href="javascript">
                                    <div class="nav2-2-box3-svg iconfont">&#xe802;</div>
                                    <div class="nav2-2-box3-text">私信</div>
                                </a>
                            </li>
                            <li class="nav2-1-box3-but3">
                                <a href="javascript">
                                    <div class="nav2-2-box3-svg iconfont">&#xe623;</div>
                                    <div class="nav2-2-box3-text">创作中心</div>
                                </a>
                            </li>
                            <li class="nav2-1-box3-but4 navImg">
                                <img src="images/avatar.jpg" alt="罢工噜" class="avatar">
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="page5-nav2-box">
                    <div class="page5-nav2-box1">
                        <img src="images/avatar.jpg" alt="罢工噜" class="avatar">
                    </div>
                    <div class="page5-nav2-box2">
                        <div class="page5-nav2-box2-1"><a href="javascript:;" class="page5-nav2-a">文章</a></div>
                        <div class="page5-nav2-box2-1"><a href="javascript:; ">关注者</a></div>
                        <div class="page5-nav2-box2-1"><a href="javascript:;">收藏</a></div>
                    </div>
                    <div class="page5-nav2-box3">
                        <button class="nav5-2-1-box2-but">编辑个人资料</button>
                    </div>
                </div>
            </div>
        </div>
        <div class="page5-header">
            <div class="header5-1">
                <img src="images/my-bg.jpg" alt="罢工噜" class="photoUp3">
                <button class="header5-1-but">
                    <label for="file3">
                        <input type="file" id="file3"></input>
                        <span class="header5-1-ico iconfont">&#xe674;</span>
                        编辑封面图片
                    </label>
                </button>
                <button class="header5-1-but stop">
                    <span class="header5-1-ico iconfont">&#xe842;</span>
                    Stop
                </button>
            </div>
            <div class="header5-2">
                <label for="file2">
                    <input type="file" id="file2"></input>
                    <div class="header5-2-change">
                        <div class="header5-2-change-ico iconfont">&#xe674;</div>
                        <div class="header5-2-change-wri">修改我的头像</div>
                    </div>
                </label>
                <div class="header5-2-ava">
                    <img src="images/avatar.jpg" alt="罢工噜" class="header5-2-img avatar">
                </div>
                <div class="header5-2-box">
                    <div class="header5-2-1">
                        <div class="header5-2-name userName">Name</div>
                        <div class="header5-2-Mes">
                            <div class="header5-2-Mes1">Id：<span class="myId"></span></div>
                            <div class="header5-2-Mes1">description：<span class="description"></span></div>
                            <div class="header5-2-Mes1">phone：<span class="phone"></span></div>
                        </div>
                    </div>
                    <div class="header5-2-2">
                        <div class="header5-2-2-box">
                            <button class="header5-2-2-left">
                                <span class="header5-2-2-l1 iconfont">&#xee18;</span>查看详细材料
                            </button>
                            <button class="header5-2-2-right">编辑个人资料</button>
                        </div>
                    </div>
                    <div class="header5-2-3">
                        <div class="header5-2-3-Id">
                            <label for="upId">
                                <div class="header5-2-3-tip">Id:</div>
                                <input type="text" class="upId" id="upId"></input>
                            </label>
                        </div>
                        <div class="header5-2-3-name">
                            <label for="upName">
                                <div class="header5-2-3-tip">Name:</div>
                                <input type="text" class="upName" id="upName"></input>
                            </label>
                        </div>
                        <div class="header5-2-3-des">
                            <label for="upDescription">
                                <div class="header5-2-3-tip">description:</div>
                                <textarea class="upDescription"></textarea>
                            </label>
                        </div>
                        <div class="header5-2-3-phone">
                            <label for="upPhone">
                                <div class="header5-2-3-tip">phone:</div>
                                <input type="number" class="upPhone"></input>
                            </label>
                        </div>
                        <div class="header5-2-3-btn"><button class="btnMyMes">提交</button></div>
                    </div>
                </div>
            </div>
        </div>
        <div class="page5-content">
            <div class="content5-left">
                <div class="content5-l1">
                    <div class="content5-l1-1"><a href="javascript:;" class="page5-nav2-a">文章</a></div>
                    <div class="content5-l1-1"><a href="javascript:; ">关注者</a></div>
                    <div class="content5-l1-1"><a href="javascript:;">收藏</a></div>
                </div>
                <div class="content5-l1-art content5-l1-part">
                    <div class="content5-l1-art1">
                        <div class="content5-l1-art1-1">我的文章</div>
                        <div class="content5-l1-art1-2-0">
                            <div class="content5-l1-art1-2-1 writing">
                                <span class="content5-l1-art1-ico0 iconfont">&#xe636;</span>
                                写文章
                            </div>
                            <div class="content5-l1-art1-2">按时间顺序
                                <span class="content5-l1-art1-ico iconfont">&#xe67f;</span>
                            </div>
                        </div>
                    </div>
                    <!-- 没有文章时显示 -->
                    <div class="content5-l1-art2">
                        <div class="content5-l1-art2-1 iconfont">&#xe658;</div>
                        <div class="content5-l1-art2-2">还没有文章，开始<a href="javascript:;" class="writing">写第一篇文章</a>
                        </div>
                    </div>
                    <!-- 我的文章 -->
                    <div class="content5-l1-art3">
                        <div class="left2-1-box2">
                            <div class="left2-1-box2-tit">
                                <a href="javascript:;" class="btn1P2 fuzzy">我的文章tit</a>
                            </div>
                            <div class="left2-1-box2-mes">
                                <img src="images/avatar.jpg" alt="罢工噜" class="avatar myClick">
                                <div class="userName">Name</div>
                            </div>
                            <a href="javascript:;">
                                <div class="left2-1-box2-wri1">
                                    <div class="left2-1-box2-img">
                                        <img src="" alt="">
                                    </div>
                                    <div class="left2-1-box2-wri1-1">
                                        <span class="left2-1-box2-wri">
                                            杰个是文章内容
                                        </span>
                                        <span class="left2-1-box2-ico">阅读全文<span class="iconfont">&#xee18;</span></span>
                                    </div>
                                </div>
                                <div class="left2-1-box2-wri2">
                                    <div class="left2-1-box2-img">
                                        <img src="" alt="">
                                    </div>
                                    <p>
                                        杰个是文章内容
                                    </p>
                                </div>

                            </a>
                            <div class="left2-1-box2-but">
                                <a href="javascript:;">
                                    <div class="left2-1-but1 agreeBox">
                                        <span class="left2-1-ico1 iconfont">&#xe615;</span>
                                        <span class="left2-1-wri1">赞同 </span>
                                        <span class="agreeMyNum"></span>
                                    </div>
                                </a>
                                <a href="javascript:;">
                                    <div class="left2-1-but3">
                                        <div class="left2-1-ico3 iconfont">&#xe758;</div>
                                        <span class="dataP2"></span>添加评论
                                    </div>
                                </a>
                                <a href="javascript:;">
                                    <div class="left2-1-but3">
                                        <div class="left2-1-ico3 iconfont">&#xe606;</div> 分享
                                    </div>
                                </a>
                                <a href="javascript:;">
                                    <div class="left2-1-but3 collectBox">
                                        <div class="left2-1-ico3 iconfont">&#xe601;</div> 收藏
                                    </div>
                                </a>
                                <a href="javascript:;">
                                    <div class="left2-1-but3 del">
                                        <div class="left2-1-ico3 iconfont">&#xe7ce;</div> 删除
                                    </div>
                                </a>
                                <a href="javascript:;">
                                    <div class="left2-1-but5 iconfont">收起 &#xe603;</div>
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="content5-l1-peo content5-l1-part peoAll">
                    <div class="content5-l1-peo1">
                        <div class="content5-l1-peo1-1">
                            <a href="javascript:;">我关注的人</a>
                        </div>
                        <div class="content5-l1-peo1-1">
                            <a href="javascript:;">关注我的人</a>
                        </div>
                    </div>
                    <div class="content5-l1-peo2">
                        <div class="content5-l1-peo2-img">
                            <img src="images/page5-peo1.jpg" alt="罢工噜">
                        </div>
                        <div class="content5-l1-peo2-box">
                            <div class="content5-l1-peo2-name"><a href="javascript:;">罗翔说刑法</a></div>
                            <div class="content5-l1-peo2-id">id: <a href="javascript:;"></a></div>
                            <!-- <div class="content5-l1-peo2-note">
                                <span class="content5-l1-peo-note1">回答</span>
                                <span class="content5-l1-peo-note1"><span>·</span>文章</span>
                                <span class="content5-l1-peo-note1"><span>·</span>关注者</span>
                            </div> -->
                        </div>
                        <div class="content5-l1-peo2-but">
                            <div><button class="content5-l1-peo2-but1">已关注</button></div>
                            <div><button class="content5-l1-peo2-but2">
                                    <span class="content5-l1-peo1-ico2">+</span>关注ta</button>
                            </div>
                        </div>
                    </div>
                    <div class="content5-l1-peo3">
                        <div class="content5-l1-peo3-1 iconfont">&#xe6ac;</div>
                        <div class="content5-l1-peo3-2">还没有关注的用户</div>
                    </div>
                </div>
                <div class="content5-l1-col content5-l1-part">
                    <div class="content5-l1-col1">
                        <div class="content5-l1-col1-box1">
                            <div class="content5-l1-col1-1">
                                <a href="javascript:;" class="content5-l1-wei-col">收藏文章聚集地</a>
                            </div>
                            <!-- 本来按知乎的模式来写 但考核没要求就先隐藏了 -->
                            <!--                             <div class="content5-l1-col1-1">
                                <a href="javascript:;">我关注的收藏夹</a>
                            </div> -->
                        </div>
                        <!--                         <button class="content5-l1-col1-box2">
                            <span class="content5-l1-col1-2">+</span>新建收藏夹
                        </button> -->
                    </div>
                    <!-- 创建收藏夹模板 -->
                    <!--                     <div class="content5-l1-col2">
                        <div class="content5-l1-col2-1"><a href="javascript:;">前端</a></div>
                        <div class="content5-l1-col2-2">2023-4-18 更新 · 0 条内容 0人关注
                            <button class="content5-l1-col2-but">
                                <span class="content5-l1-col2-ico iconfont">&#xe758;</span>添加评论
                            </button>
                            <button class="content5-l1-col2-but">
                                <span class="content5-l1-col2-ico iconfont">&#xe636;</span>编辑
                            </button>
                            <button class="content5-l1-col2-but">
                                <span class="content5-l1-col2-ico iconfont">&#xe7ce;</span>删除
                            </button>
                        </div>
                    </div> -->
                    <div class="content5-l1-col2">
                        <div class="content5-l1-col3-box1">
                            <div class="content5-l1-col2-use">userId: <span></span></div>
                            <div class="content5-l1-col2-text">articleId: <span></span></div>
                        </div>
                        <div class="content5-l1-col3-box2">
                            <div class="content5-l1-col3-but">
                                <div><button class="content5-l1-col3-but1">已收藏</button></div>
                                <div><button class="content5-l1-col3-but2">
                                        <span class="content5-l1-col3-ico2">+</span>收藏</button>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="content5-l1-col3">
                        <div class="content5-l1-col3-1 iconfont">&#xe614;</div>
                        <div class="content5-l1-col3-2">还没有收藏文章哦</div>
                    </div>
                </div>
            </div>
            <div class="content5-right">
                <div class="content5-r1">
                    <div class="content5-r1-box">
                        <a href="javascript:;">
                            <div class="content5-r1-wri content5-r1-wri1">关注了</div>
                            <div class="content5-r1-num numPeoAll">1</div>
                        </a>
                    </div>
                    <div class="content5-r1-box">
                        <a href="javascript:;">
                            <div class="content5-r1-wri content5-r1-wri2">关注者</div>
                            <div class="content5-r1-num">0</div>
                        </a>
                    </div>
                </div>
                <div class="right2-5">
                    <a href="https://liukanshan.zhihu.com/">刘看山</a>
                    <span>·</span>
                    <a href="javascript:;">A乎指南</a>
                    <span>·</span>
                    <a href="javascript:;">A乎指协议</a>
                    <span>·</span>
                    <a href="javascript:;">A乎隐私保护指引</a>
                    <br>
                    <a href="javascript:;">应用</a>
                    <span>·</span>
                    <a href="javascript:;">工作</a>
                    <span>·</span>
                    <a href="javascript:;">申请开通A乎机构号</a>
                    <br>
                    <a href="javascript:;">侵权举报</a>
                    <span>·</span>
                    <a href="javascript:;">网上有害信息举报专区</a>
                    <br>
                    <a href="javascript:;">京ICP证 1010** 号</a>
                    <br>
                    <a href="javascript:;">京ICP备 101010** 号 - 1</a>
                    <br>
                    <a href="javascript:;"><img src="images/page1-but.png" alt="罢工噜">京公网安备121212121212** 号</a>
                    <br>
                    <a href="javascript:;">京网文[2023]1234-567 号</a>
                    <br>
                    <a href="javascript:;">药品医疗器械网络信息服务备案</a>
                    <br>
                    <a href="javascript:;">（京）网药械信息备字（2023）第00000号</a>
                    <br>
                    <a href="javascript:;">服务热线： 400-919-0001</a>
                    <br>
                    <a href="javascript:;">违法和不良信息举报：010-82716601</a>
                    <br>
                    <a href="javascript:;">举报邮箱：jubao@zhihu.com</a>
                    <br>
                    <a href="javascript:;">儿童色情信息举报专区</a>
                    <br>
                    <a href="javascript:;">互联网算法举报专区</a>
                    <br>
                    <a href="javascript:;">养老诈骗举报专区</a>
                    <br>
                    <a href="javascript:;">MCN举报专区</a>
                    <br>
                    <a href="javascript:;">信息安全漏洞反馈专区</a>
                    <br>
                    <a href="javascript:;">内容从业人员违法违规学委举报</a>
                    <br>
                    <a href="javascript:;">网络谣言信息举报专区</a>
                    <br>
                    <a href="javascript:;">自媒体乱象举报专区</a>
                    <br>
                    <a href="javascript:;">证照中心 · Investor Relations</a>
                    <br>
                    <a href="javascript:;" class="iconfont">联系我们&#xe67a;2023 A乎</a>
                    <br>
                    <a href="javascript:;">广东智者地上科技无限公司版权所有</a>
                    <br>
                    <img src="images/page1-but2.png" alt="罢工噜">
                </div>
            </div>
        </div>
    </div>

    <!-- page6-文章发布区 -->
    <div class="page6-boss boss">
        <div class="page6-nav">
            <div class="page6-nav-box">
                <div class="logo1 logo"></div>
                <div class="page6-nav-tit">写文章</div>
                <div class="page-nav-svg">. . .</div>
                <div class="page2-nav-avatar avatar">
                    <img src="images/avatar.jpg" alt="罢工噜" class="avatar navImg">
                </div>
            </div>
        </div>
        <div class="page6-content">
            <label for="titWri">
                <div class="content6-tit">
                    <input type="text" class="titWri" id="titWri" placeholder="请输入标题~"></input>
                </div>
            </label>
            <div class="content6-text">
                <textarea class="textWri" placeholder="请输入正文~"></textarea>
            </div>
            <div class="content6-img">
                <label class="file">
                    <div class="img6-1">添加封面 :</div>
                    <div class="img6-2">
                        <div class="img6-2-wri">+点击上传</div>
                        <input type="file" id="file"></input>
                        <img src="" class="photoUp" alt="" class="img">
                    </div>
                    <div class="img6-3">
                        <button>取消上传</button>
                    </div>
                </label>
            </div>
            <div class="content6-btn0">
                <div class="content6-btn">提交</div>
            </div>


        </div>
    </div>


    <!-- <script src="js/page1.js"></script> -->
    <!-- <script src="js/page2.js"></script> -->
    <!-- <script src="js/nav.js"></script> -->
    <script src="js/script.js"></script>
</body>

</html>